<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .demo1{
            height:50px ;
            width:694px;
            font-size: 0;
            margin: 50px auto 0;
        }
        .demo1 a{
            display: inline-block;
            height: 48px;
            width: 98px;
            border:1px solid gold ;     
            font: 16px '微软雅黑';
            color: pink;  
            margin-left: -1px;  
            text-align: center;
            line-height: 48px;
            text-decoration: none;  
        }
        .demo1 a:hover{
            background-color: gold;
            color: #ffffff;
        }
       .demo2{
           border-bottom:1px solid orangered ;
           width: 400px;
           margin: 50px auto 0;
       }
      .demo2 div{
          height: 41px;
          width: 80px;
          background: #ff8200;
      }
      .demo2 a{
          display: inline-block;
      padding-left: 7px;
      line-height: 41px;
      font-size: 16px ;
      color: beige;
      }
      .demo2 span{
          float:right;
         margin-top: -30px;
         font-size: 14px;
         color: #666;
      }
      .demo3{
        margin: 50px auto 0;
   height: 82px;
   width: 402px;
   border: 1px solid  #ff8200;
   margin-top: 20px;
      }
      .demo3 div{
          height: 60px;
          width: 60px;
         
      }
     .demo3-q{
        float: left;
        background-color: #90ee90;
        margin: 10px;

     }
     .demo3-w{
        float: right;
        background-color:pink;
        margin: 10px;

     }
     .demo4{
        width: 694px;
        height: 50px;
        margin: 50px auto 0;
     }
     .demo4 a{
        float: left;
        text-decoration: none;
        width: 98px;
        height: 48px;
        border: 1px gold solid;
        margin-left:-1px;
        text-align: center;
        font:16px/48px '微软雅黑';
        color: pink;
     }
     .demo4 a:hover{
            background-color: gold;
            color: #ffffff;
        }
     .demo5{
         margin: 50px auto 0;
         height: 212px;
         width:452px ;
         border: 1px solid #ff8200;
     }
     .demo5 img{
         float: left;
         margin: 10px;
     }
     .demo6{
        border: 1px solid black;
       width: 210px;
       margin: 50px auto 0;
       
     }
     .text{
        float: left;
        width: 50px;
        height:50px;  
        margin: 10px;
        background-color: gold;
     }
     .demo6::after,.demo6::before{
            content: "";
            display: table;
        }
        .demo6::after{
            clear: both;
        }
        .demo6{
            zoom: 1;
        }

    </style>
</head>
<body>
    <div class="demo1">
    <a  href="#">首页</a>
    <a  href="#">公司简历</a>
    <a  href="#">解决方案</a>
    <a  href="#">公司新闻</a>
    <a  href="#">行业动态</a>
    <a  href="#">招贤纳才</a>
    <a  href="#">联系我们</a>
</div>
<hr>
<div class="demo2">
    <div>
    <a >新闻列表</a>
</div>
    <span>更多>></span>
</div>
<hr>
<div class="demo3">
    <div class="demo3-q"></div>
  <div class="demo3-w"></div>
</div>
<hr>
<div class="demo4">
    <a  href="#">首页</a>
    <a  href="#">公司简历</a>
    <a  href="#">解决方案</a>
    <a  href="#">公司新闻</a>
    <a  href="#">行业动态</a>
    <a  href="#">招贤纳才</a>
    <a  href="#">联系我们</a>
</div>
<hr>
<div class="demo5">
    <img src="./imgs/bg.jpg" alt="图片加载失败" title="Html5">
    <p>
        HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。
        HTML 的上一个版本诞生于 1999 年。自从那以后，Web 世界已经经历了巨变。
        HTML5 仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。
        HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。
        HTML 的上一个版本诞生于 1999 年。自从那以后，Web 世界已经经历了巨变。
        HTML5 仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。
    </p>
</div>
<hr>
<div class="demo6">
    <div class="text">1</div>
    <div class="text">2</div>
    <div class="text">3</div>
    <div class="text">4</div>
    <div class="text">5</div>
    <div class="text">6</div>
    <div class="text">7</div>
    <div class="text">8</div>
</div>
</body>
</html>